<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>教师授课满意度问卷调查表</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" href="css/bootstrap.css" />
		<link rel="stylesheet" href="css/style.css" />
		<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
		</script>
		<style type="text/css">
			.radio {
				width: 14px;
				height: 14px;
				margin: auto;
				background-image: url(img/radio.png);
				background-position: -8px -12px;
			}
			
			.radio_select {
				background-position: -40px -12px;
			}
		</style>
	</head>

	<body>
		<div class="container">
			<div style="border-bottom: 1px solid black;">
				<img src="img/logo.png.jpg" class="img-responsive" />
				<!--<h1>WISEZONE</h1>
				<h2>华信智原</h2>
				<h3>云南IT高技能人才培养基地</h3>-->
			</div>
			<h3 class="col-lg-12 text-center">教师满意度问卷调查表</h3>
			<h4 class="col-lg-12 text-right">编号：XHQ-YNKM-QR-7.5-13</h4>
			<form>
				<div class="row" style="margin-top: 50px;">
					<p class="col-lg-3">专业:
						<input type="hidden" name="majorid" />
						<select id="major" name="majorname" class="form-control"></select>
					</p>
					<p class="col-lg-3">课程：
						<input type="hidden" name="courseid" />
						<select id="course" name="coursename" class="form-control"></select>
					</p>
					<p class="col-lg-3">教师：
						<input type="hidden" name="teacherid" />
						<select id="teacher" name="teachername" class="form-control"></select>
					</p>
					<p class="col-lg-3">日期：<input type="text" placeholder="date" name="course" class="form-control" id="dateinput" disabled="disabled" /></p>
				</div>
				<table border="1px" style="margin-top: 30px;" class="table table-responsive table-condensed table-bordered">
					<tr>
						<th rowspan="3">序号</th>
						<th rowspan="3">调查项</th>
						<th rowspan="3">调查细节项目</th>
						<th colspan="5">满意度得分</th>
					</tr>
					<tr>
						<th>很满意</th>
						<th>满意</th>
						<th>一般</th>
						<th>不满意</th>
						<th>很不满意</th>
					</tr>
					<tr>
						<th>5分</th>
						<th>4分</th>
						<th>3分</th>
						<th>2分</th>
						<th>1分</th>
					</tr>
					<tr>
						<input type="hidden" name="score1" id="score1" />
						<td rowspan="3">1</td>
						<td rowspan="3">教学计划</td>
						<td>准备充分、具有良好的组织计划性</td>
						<td class="sel">
							<span class="radio" score="5"></span>
						</td>
						<td class="sel">
							<span class="radio" score="4"></span>
						</td>
						<td class="sel">
							<span class="radio" score="3"></span>
						</td>
						<td class="sel">
							<span class="radio" score="2"></span>
						</td>
						<td class="sel">
							<span class="radio" score="1"></span>
						</td>
					</tr>
					<tr>
						<td>合计</td>
						<td></td>
						<td></td>
						<td></td>
						<td></td>
						<td></td>
						<td></td>
						<td></td>
					</tr>
					<tr>
						<td>建议</td>
						<td colspan="7">
							<textarea class="col-lg-12"></textarea>
						</td>
					</tr>
				</table>
				<div class="row">
					<div class="col-lg-6 btn-group-lg text-center"><button type="submit" class="btn btn-success">提交</button></div>
					<div class="col-lg-6 btn-group-lg text-center"><button type="reset" class="btn btn-warning">重置</button></div>
				</div>
		</div>
		</form>
		<script type="text/javascript">
			window.onload = function() {
				var today = new Date();
				$("#dateinput").attr("value", today);
			};
			$(".sel").click(
				function(e) {
					var x;
					var ele = e.target || e.srcElement;
					$(ele).parents().children(".sel").children(".radio").removeClass("radio_select");
					$(ele).children(".radio").addClass("radio_select");
					$(ele).addClass("radio_select");
					if (ele.tagName == "SPAN") {
						x = $(ele).attr("score");
					} else {
						x = $(ele).children(".radio").attr("score");
					}
					var row = $(this).parent().index() - 2;
					var s = $("#score" + row).val(x);
				});
			$.ajax({
				type: "get",
				url: "GetMajor",
				success: function(data) {
					var da = $.parseJSON(data);
					$.each(da, function(index, mj) {
						$("#major").append("<option>" + mj.name + "</option>");
					});
				}
			});
			$.ajax({
				type: "get",
				url: "DefaultGetCourse",
				success: function(data) {
					var da = $.parseJSON(data);
					$.each(da, function(index, cs) {
						$("#course").append("<option>" + cs.name + "</option>")
					});
				}
			});
			$.ajax({
				type: "get",
				url: "DefaultGetTeacher",
				success: function(data) {
					var da = $.parseJSON(data);
					$.each(da, function(index, ts) {
						$("#teacher").append("<option>" + ts.name + "</option>")
					});
				}
			});
			$("#major").change(function(e) {
				var ele = e.target;
				$.ajax({
					type: "get",
					url: "GetCourse?mname=" + ele.value,
					success: function(data) {
						$("#course").html("");
						var da = $.parseJSON(data);
						$.each(da, function(index, cs) {
							$("#course").append("<option>" + cs.name + "</option>");
						});
					}
				});
			});
			$("#course").change(function(e) {
				var ele = e.target;
				$.ajax({
					type: "get",
					url: "GetTeacher?tname=" + ele.value,
					success: function(data) {
						$("#teacher").html("");
						var da = $.parseJSON(data);
						$.each(da, function(index, cs) {
							$("#teacher").append("<option>" + cs.name + "</option>");
						});
					}
				});
			})
		</script>

	</body>

</html>